<template>
  <div id="dept-apply">
    <div class="dept-apply-title">科室请领请购</div>
    <dv-scroll-board :config="config" style="width: 100%;height: 80%;text-align: center;"/>
  </div>
</template>

<script>
export default {
  name: 'DeptApply',
  data() {
    return {
      config: {}
    }
  },
  methods: {
    async createData() {
      let deptApply = []
      await this.$ajax.get('/dept/apply/findDeptApply').then(resp => {
        if (resp.code != 0) {
          global.utilMessage.alertFail(`获取本周科室请领请购发生错误：${resp.msg}`)
          return
        }
        if (resp.data.length > 0) {
          resp.data.forEach((item, index) => {
            let dept = []
            dept.push(item.matrName)
            dept.push(item.skuQty + item.skuUnit)
            dept.push(item.deptName)
            dept.push(item.busUser)
            dept.push(item.gmtCreate)
            deptApply.push(dept)
          })
        }
      })
      this.config = {
        header: ['耗材', '数量', '部门', '请领人', '时间'],
        data: deptApply,
        index: true,
        columnWidth: [60, 300, 100, 200, 100, 200],
        align: 'center',
        rowNum: 5,
        //表头背景色
        headerBGC: '#1981f6',
        headerHeight: 40,
        //奇数行背景色
        oddRowBGC: 'rgba(0, 44, 81, 0.8)',
        //偶数行背景色
        evenRowBGC: 'rgba(10, 29, 50, 0.8)'
      }
    }
  },
  mounted() {
    const { createData } = this

    createData()

    setInterval(createData, 1800000)
  }
}
</script>

<style lang="scss">
#dept-apply {
  position: relative;
  height: 40%;
  width: 100%;
  margin: 10px 0;
  background-color: rgba(6, 30, 93, 0.5);
  border-top: 2px solid rgba(1, 153, 209, .5);
  box-sizing: border-box;

  .dept-apply-title {
    height: 20%;
    font-weight: bold;
    text-indent: 20px;
    font-size: 20px;
    display: flex;
    align-items: center;
  }
}
</style>
